<template>
	<van-search v-model="keyword" show-action shape="round" background="#f8f8f8" placeholder="请输入批次名称" @clear="onSearch" @input="changeVal">
		<template #action>
			<div @click="onSearch">搜索</div>
		</template>
	</van-search>
</template>

<script>
export default {
	name: "search-bar",
	data() {
		return {
			keyword: "",
		};
	},
	methods: {
		onSearch() {
			this.$emit("send", this.keyword.trim());
		},
		changeVal(){
			if(this.keyword.trim()===''){
				this.onSearch()
			}
		}
	},
};
</script>

<style lang="scss" scoped>
:v-deep .van-search {
	width: 100% !important;
}

::v-deep .van-search__content {
	background-color: #fff;
}
</style>
